<template>
	<div class="box">
		<MiInput placeholder="手机号码" :value="phone" :handler="changePhone"></MiInput>
		<MiInput placeholder="短信验证码" :value="code" :handler="changeCode"></MiInput>
		<div class="err_tip" v-if="err" v-text="text"></div>
		<MiButton text="立即登录/注册" :handler="login"></MiButton>
	</div>
</template>

<script type="text/ecmascript-6">
	import MiInput from "./MiInput";
	import MiButton from "./MiButton";
	import axios from "axios";
    import http from "../utils/http.js";
    export default {
        data(){//数据
            return{
                phone:"",
	            code:"",
	            err:false,
	            text:null
            }
        },
	    computed:{ },
	    components:{
            MiInput,MiButton
	    },
	    methods:{//方法
			changePhone(e){this.phone = e.target.value;},
		    changeCode(e){this.code = e.target.value},
		    login(){
			    if(!this.phone && !this.code){
					this.err = true;
			    }else{
                    this.err = false;
                    document.cookie="userinfo="+ this.phone;//本地写入cookie
				    http.post("/user/messageLogin",{
                        phone:this.phone,
                        code:this.code,
                        userinfo:this.phone
				    })
					    .then((result)=>{
					        if(result){
                                this.err = true;
								this.text = result;
					        }else{
                                this.$store.dispatch("cart/init",this.phone);
                                let router = this.$route.query.router;
                                if(router === undefined){
									this.$router.push({path:"/"});
                                }else{
                                    this.$router.replace("" + router);//$router代表改变路由//$route表示获取//从哪里来跳哪里去
                                }

					        }
					    })
			    }
		    }
	    }
    };
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
	*
		outline none
	.box
		padding-top 0.4rem
		.button
			margin-top .5rem
		.err_tip
			margin 0.3rem auto
			width 85%
			margin-bottom 5px
			line-height 20px
			color #F66
			padding-top 14px
</style>